$(function(){ 	 	  
	  $('#members').datagrid({
	      url: 'viewMember',
	      method:'get',
	      rownumbers:true,
	      pagination:true,
	      pageSize:20,
	      pageList:[10,20,30],
	      fitColumns:true,
	      autoRowHeight:true,
	      singleSelect:true,
	      striped:true,
	      idField:'id',
	      columns:[[
	  			  {field:'id', title:'Customer Id'},
	  			  {field:'name', title:'Customer Name', formatter:function(value, row){
	  				  return row.name.firstName + '_' + row.name.lastName;
	  			  }},
	  	          {field:'address.address1', title:'Address', formatter:function(value, row){
	  	              return row.address.address1;
	  	          }},
	  	          {field:'opt1', title:'', formatter:function(value, row, index){
  	        		  return '<a href=\"javascript:void(0)\" onclick=\"viewPayment(' + row.id + ')\">View Payment</a>';
	  	          }},
	  	         {field:'opt2', title:'', formatter:function(value, row, index){
  	        		  return '<a href=\"goto_modifyMember/' + row.id + '\">Edit Customer Info</a>';
	  	          }}
	  	  ]]
	   });
	  
	  $('#payments').datagrid({
		  autoLoad:false
	   });
	  
	  $('#paymentsUnreturned').datagrid({
		  autoLoad:false
	   });
	  
	  $('#returnMemberTable').click(function(){
		  $('html, body').animate({
		        scrollTop: $('#member').offset().top
		    }, 1500);
	  });
}); 

function doSearch(){
    $('#members').datagrid('load',{
        memberId: $('#customerId').val()
    });
}

function viewPayment(memberId){	
	$('html, body').animate({
        scrollTop: $('#payment').offset().top
    }, 1500);
	
	$('#payments').datagrid({
		  url: 'viewOrder?memberId=' + memberId,
	      method:'get',
	      rownumbers:true,
	      pagination:true,
	      pageSize:20,
	      pageList:[10,20,30],
	      fitColumns:true,
	      autoRowHeight:true,
	      singleSelect:true,
	      striped:true,
	      idField:'id',
	      columns:[[
	  			  {field:'id', title:'Payment Id', hidden:true},
	  			  {field:'customer.id', title:'Member Id', hidden:true},
	  	          {field:'rental.inventory.film.title', title:'Film Title', formatter:function(value, row){
	  	              return row.rental.inventory.film.title;
	  	          }},
	  	          {field:'staff.store.address.address1', title:'Store Address', formatter:function(value, row){
	  	              return row.rental.inventory.store.address.address1;
	  	          }},
	  	          {field:'rental.inventory.film.rentalRate', title:'Rental Rate', formatter:function(value, row){
	  	        	  return '$' + row.rental.inventory.film.rentalRate;
	  	          }},
	  	          {field:'amount', title:'Total Amount', formatter:function(value, row){
	  	        	  return '$' + row.amount;
	  	          }},
	  	          {field:'rental.rentalDate', title:'Rental Date', formatter:function(value, row, index){
	  	        	  return row.rental.rentalDate;
	  	          }},
	  	          {field:'rental.returnDate', title:'Return Date', formatter:function(value, row, index){
	  	        	  if(!row.rental.returnDate){
	  	        		  return '<span sytle=\"color:red;\">Not Returned Yet</span>';
	  	        	  }
	  	        	  return row.rental.returnDate;
	  	          }}
	  	  ]]
	   });
	
	$('#paymentsUnreturned').datagrid({
		  url: 'viewUnreturned/' + memberId,
	      method:'get',
	      rownumbers:true,
	      pagination:true,
	      pageSize:20,
	      pageList:[10,20,30],
	      fitColumns:true,
	      autoRowHeight:true,
	      singleSelect:true,
	      striped:true,
	      idField:'id',
	      columns:[[
	  			  {field:'id', title:'Payment Id', hidden:true},
	  			  {field:'customer.id', title:'Member Id', hidden:true},
	  	          {field:'rental.inventory.film.title', title:'Film Title', formatter:function(value, row){
	  	              return row.rental.inventory.film.title;
	  	          }},
	  	          {field:'staff.store.address.address1', title:'Store Address', formatter:function(value, row){
	  	              return row.rental.inventory.store.address.address1;
	  	          }},
	  	          {field:'rental.inventory.film.rentalRate', title:'Rental Rate', formatter:function(value, row){
	  	        	  return '$' + row.rental.inventory.film.rentalRate;
	  	          }},
	  	          {field:'amount', title:'Total Amount', formatter:function(value, row){
	  	        	  return '$' + row.amount;
	  	          }},
	  	          {field:'rental.rentalDate', title:'Rental Date', formatter:function(value, row, index){
	  	        	  return row.rental.rentalDate;
	  	          }},
	  	          {field:'rental.returnDate', title:'Return Date', formatter:function(value, row, index){
	  	        	  if(!row.rental.returnDate){
	  	        		  return '<span sytle=\"color:red;\">Not Returned Yet</span>';
	  	        	  }
	  	        	  return row.rental.returnDate;
	  	          }}
	  	  ]]
	});
}

function doPaymentSearch(){
	 if(!$('#startDate').datebox('getValue') && !$('#endDate').datebox('getValue')){
		 $('#payments').datagrid('load');
	 }else if(!$('#startDate').datebox('getValue')){
		 $('#payments').datagrid('load',{
		        endDate: $('#endDate').datebox('getValue')
		 });
	 }else if(!$('#endDate').datebox('getValue')){
		 $('#payments').datagrid('load',{
		        startDate: $('#startDate').datebox('getValue')
		 });
	 }else{
		 $('#payments').datagrid('load',{
		        startDate: $('#startDate').datebox('getValue'),
		        endDate: $('#endDate').datebox('getValue')
		 });
	 } 
}